import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'

const routes: RouteRecordRaw[] = [
  {
    path: '/',
    name: 'Index',
    component: () => import('@/views/Index.vue'),
  },
  {
    path: '/home',
    name: 'Home',
    component: () => import('@page/Home.vue'),
    redirect: '/md/introduce',
  },
  {
    path: '/md',
    name: 'md',
    component: () => import('@page/Home.vue'),
    children: [
      { path: '', redirect: '/md/introduce' },
      { path: '/md/:name', component: () => import('@page/Md/Md.vue') },
    ]
  },
  {
    path: '/components',
    name: 'Components',
    component: () => import('@page/Home.vue'),
    children:[
      {
        path: 'button',
        name: 'Button',
        component: () => import('@page/Button/Button.vue'),
      },
      {
        path: 'switch',
        name: 'Switch',
        component: () => import('@page/Switch/Switch.vue'),
      },
      {
        path: 'checkbox',
        name: 'Checkbox',
        component: () => import('@page/Checkbox/Checkbox.vue'),
      },
      {
        path: 'modal',
        name: 'Modal',
        component: () => import('@page/Modal/Modal.vue'),
      },
    ]
  },
  // {
  //   path: '/*',
  //   name: 'Index',
  //   component: () => import('@/views/Index.vue'),
  // },
]

const router = createRouter({
  history: createWebHistory(),
  routes,
})

export default router

